프로퍼티스크립터

바스크립트(JavaScript)는 동적 언어로서 객체의 프로퍼티를 유연하게 조작할 수 있는 다양한 기능을 제공합니다. 그 중에서도 **프로퍼티 디스크립터**(Property Descriptor)는 객체의 프로퍼티 어떻게 동작하는지를 정의하는 핵심 개념입니다. 이 문서에서는 프로퍼티 디스크립터의 정의, 종류, 속성, 사용법 및 실용적인 예시를 통해 자바스크립트 객체의 내부 동작 방식을 깊이 있게 이해할 수 있도록 설명합니다.

---

## 개요

자바스크립트에서 모든 객체의 프로퍼티는 단순한 키-값 쌍 이상의 정보를 가지고 있습니다. 이 정보를 **프로퍼티 디스크립터**라고 하며, 프로퍼티의 **가시성**, **수정 가능성**, **열거 가능성**, **재정의 가능성** 등을 제어할 수 있습니다. 프로퍼티 디스크립터는 `Object.getOwnPropertyDescriptor()` 또는 `Object.defineProperty()` 같은 메서드를 통해 접근하거나 설정할 수 있습니다.

프로퍼티 디스크립터는 객체의 프로퍼티가 **데이터 프로퍼티**(Data Property)인지 **접근자 프로퍼티**(Accessor Property)인지에 따라 구조가 다릅니다.

---

## 프로퍼티 디스크립터의 종류

### 1. 데이터 프로퍼티 (Data Property)

일반적인 키-값 형태의 프로퍼티입니다. 값과 관련된 속성을 포함합니다.

#### 디스크립터 속성:
- `value`: 프로퍼티의 값. 기본값은 `undefined`.
- `writable`: 값이 변경 가능한지 여부 (`true`/`false`). `false`일 경우 읽기 전용.
- `enumerable`: `for...in` 루프나 `Object.keys()` 등에서 열거될 수 있는지 여부.
- `configurable`: 프로퍼티의 속성(예: `writable`, `enumerable`)이 변경 가능한지, 또는 프로퍼티가 삭제 가능한지 여부.

### 2. 접근자 프로퍼티 (Accessor Property)

값 대신 `getter`와 `setter` 함수를 사용하는 프로퍼티입니다. 값에 접근하거나 설정할 때 특정 로직을 실행할 수 있습니다.

#### 디스크립터 속성:
- `get`: 프로퍼티를 읽을 때 호출되는 함수. 기본값은 `undefined`.
- `set`: 프로퍼티에 값을 할당할 때 호출되는 함수. 기본값은 `undefined`.
- `enumerable`: 동일.
- `configurable`: 동일.

> 💡 **주의**: 데이터 프로퍼티와 접근자 프로퍼티는 동시에 존재할 수 없습니다. 즉, `value`/`writable`과 `get`/`set`을 동시에 설정하면 에러가 발생합니다.

---

## 프로퍼티 디스크립터 조작하기

### 1. 디스크립터 읽기: `Object.getOwnPropertyDescriptor()`

```javascript
const obj = { name: "Alice" };
const descriptor = Object.getOwnPropertyDescriptor(obj, "name");
console.log(descriptor);
// { value: "Alice", writable: true, enumerable: true, configurable: true }
```

### 2. 디스크립터 설정: `Object.defineProperty()`

```javascript
const person = {};

Object.defineProperty(person, "age", {
  value: 25,
  writable: false,       // 값 변경 불가
  enumerable: true,      // for...in에서 열거 가능
  configurable: false    // 재정의/삭제 불가
});

person.age = 30; // 무시됨 (writable: false)
delete person.age; // 삭제 실패 (configurable: false)

console.log(person.age); // 25
```

### 3. 여러 프로퍼티 정의: `Object.defineProperties()`

```javascript
const car = {};

Object.defineProperties(car, {
  brand: {
    value: "Toyota",
    writable: true,
    enumerable: true,
    configurable: true
  },
  model: {
    get() {
      return this._model;
    },
    set(value) {
      this._model = value.toUpperCase();
    },
    enumerable: true,
    configurable: true
  }
});

car.model = "corolla";
console.log(car.model); // "COROLLA"
```

---

## 디스크립터 속성의 의미와 활용 사례

| 속성 | 설명 | 활용 사례 |
|------|------|----------|
| `writable` | 값이 수정 가능한지 | 상수처럼 사용하고 싶은 프로퍼티를 읽기 전용으로 설정 |
| `enumerable` | 열거 가능한지 | 디버깅 시 노출되지 않게 숨기고 싶은 프로퍼티 |
| `configurable` | 재정의/삭제 가능 여부 | 프레임워크에서 내부 상태를 보호하기 위해 사용 |
| `get` / `set` | 접근/할당 시 로직 실행 | 데이터 유효성 검사, 계산된 속성, 로깅 등 |

---

## 참고: `Object.getOwnPropertyDescriptors()`

ES2017에서 도입된 이 메서드는 객체의 **모든 프로퍼티 디스크립터**를 한 번에 반환합니다. 객체를 정확히 복제할 때 유용합니다.

```javascript
const obj = { a: 1 };
Object.defineProperty(obj, "b", {
  value: 2,
  writable: false
});

const descriptors = Object.getOwnPropertyDescriptors(obj);
console.log(descriptors);
// { a: {value: 1, writable: true, enumerable: true, configurable: true},
//   b: {value: 2, writable: false, enumerable: false, configurable: false} }
```

이를 활용하면 `Object.defineProperties()`로 정확히 동일한 객체를 재생성할 수 있습니다.

---

## 관련 문서 및 참고 자료

- [MDN Web Docs: Property descriptors](https://developer.mozilla.org/ko/docs/Web/JavaScript/Data_structures#%ED%94%84%EB%A1%9C%ED%8D%BC%ED%8B%B0_%EB%94%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%84%B0)
- [ECMAScript Specification - Object Internal Methods and Internal Slots](https://tc39.es/ecma262/#sec-object-internal-methods-and-internal-slots)
- `Object.defineProperty()` 문서: [MDN defineProperty](https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty)

---

프로퍼티 디스크립터는 자바스크립트의 객체 지향 프로그래밍과 메타프로그래밍의 핵심 기능 중 하나입니다. 이를 이해하면 객체의 동작을 더 세밀하게 제어하고, 견고한 코드를 작성할 수 있습니다. 특히 라이브러리나 프레임워크를 개발할 때 매우 유용하게 활용됩니다.